Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
thetaPC
reviewed
Jul 14, 2026
brandyscarney
approved these changes
Jul 15, 2026
brandyscarney
left a comment
Member
There was a problem hiding this comment.
Looks good! A few questions on documentation. 👍
Comment on lines
+18
to
+25
| <!-- | ||
| As of Ionic 9, ion-nav no longer integrates with ion-router. This page | ||
| reproduces the pattern from https://github.com/ionic-team/ionic-framework/issues/24641, | ||
| where an ion-router and an ion-nav coexist. The ion-nav must manage its own | ||
| stack via `root` and ion-nav-link, the URL must never change as the stack | ||
| changes, and the page must still finish loading even though the router has no | ||
| outlet to drive. | ||
| --> |
Member
There was a problem hiding this comment.
Should we document how these work together somewhere? Possibly at https://ionicframework.com/docs/api/nav?
Member
Author
There was a problem hiding this comment.
Done on the docs PR here: 7e0063a
I didn't want to do it in nav because nav directly tells people not to use it for routing and for routing to use ion-router and I didn't want it to get confusing by immediate talking about routing with ion-nav, so I did it as an example on the ion-router page: https://ionic-docs-git-fw-6976-ionic1.vercel.app/docs/api/router#using-ion-nav-within-a-routed-page
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Issue number: internal
What is the current behavior?
ion-navdoubles as anion-routeroutlet. On load,nav.tsxchecksdocument.querySelector('ion-router')to set auseRouterflag, andion-navis listed in the router'sOUTLET_SELECTOR. When the router drives it,ion-navexposes internalsetRouteId()/getRouteId()methods, runsrouter.canTransition()guards insidequeueTrns, and callsrouter.navChanged()on a successful transition so thatpush/pop,ion-nav-link, and swipe-to-go-back all update the URL. This couples an imperative stack component to URL-based routingWhat is the new behavior?
ion-navis now a standalone imperative stack-navigation component with noion-routerintegration. It implementsComponentInterfaceinstead ofNavOutletand dropsuseRouter, thesetRouteId()/getRouteId()methods, thecanTransition()guard check, thenavChanged()URL update, the root-attribute-with-router warning, and theupdateURLnav option. The router no longer listsion-navinOUTLET_SELECTOR, so anion-navplaced inside anion-routeris no longer discovered or driven as a routed outletDropping
ion-navfromOUTLET_SELECTORexposed a hang: a page with anion-routerbut noion-router-outletorion-tabs(the #24641 pattern) leftwaitUntilNavNode()waiting forever, so the router'scomponentWillLoadnever settled and the app never signalled that it finished loading.waitUntilNavNode()now resolves onionNavWillLoador a 500ms timeout, and warns in dev when no outlet is foundDoes this introduce a breaking change?
Apps that relied on
ion-navto update the URL (pushing components and expecting the browser URL to change, or having router guards run on nav transitions) should useion-router-outletfor URL-based routing. Anion-navcan still be used inside a routed page for local, URL-less stack navigation. See the Nav section inBREAKING.mdfor the migration path.Other information
BREAKING.mdis updated with a new Nav section androute.tsxdoc now listsion-router-outletinstead ofion-navas the navigation outletPreview (nav routing test page):